<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<title>${name_china}管理列表</title>
<%@include file="/common/head.jsp" %>
<style>
.maskback{
	position:fixed;
	width:100%;
	height:100%;
	top:0px;
	background:rgba(0,0,0,0.7);
}
.mainback {
    width: 65%;
    height: 250px;
    background: #fff;
    margin: auto;
    margin-top: 4%;
    overflow: auto;
}

.maskbackf{
	position:fixed;
	width:100%;
	height:100%;
	top:0px;
	background:rgba(0,0,0,0.7);
}
.mainbackf{
    width: 65%;
    height: 250px;
    background: #fff;
    margin: auto;
    margin-top: 4%;
    overflow: auto;
}
</style>
</head>
<body class="iframe-page">
<div class="page-title-wrapper">
    <div class="page-title">
        <div class="page-title-text">
            <span>${name_china}管理</span>
        </div>
        <div id="toolbar" style="float: right"></div>
    </div>
    <div class="page-title-border"></div>
</div>

<div class="search-field">
    <span class="field-cont">
        <span class="field-cont-title">投诉ID</span>
        <input type="text" class="summer-input" id="id"/>
    </span>
    <span class="field-cont">
        <span class="field-cont-title">昵称/ID</span>
        <input type="text" class="summer-input" id="userId"/>
    </span><br/>
    <span class="field-cont">
        <span class="field-cont-title">提交时间</span>
        <input type="text" class="summer-input" id="createTime"/>
    </span>
    <span class="field-cont">
        <span class="field-cont-title">-</span>
        <input type="text" class="summer-input" id="updateTime"/>
    </span>
    <span class="field-cont">
        <span class="field-cont-title">解决状态</span>
        <input type="text" class="summer-input" id="isFinished"/>
    </span>
    <span class="field-btn-wrapper">
        <a id="search" class="btn btn-primary btn-icon wave distance-right"><i class="icon icon-search"></i></a>
        <a id="reset" class="btn btn-icon wave wave-dark"><i class="icon icon-refresh"></i></a>
    </span>
</div>

<div id="t-wrap">
    <table class="summer-datagrid" id="dataList">
	    <col width="20%">
	    <col width="20%">
	    <col width="20%">
	    <col width="20%">
	    <col width="20%">
	    <col width="20%">
	    <thead>
		    <tr>
		        <th>投诉ID</th>
		        <th>昵称/ID</th>
		        <th>手机号</th>
		        <th>解决状态</th>
		        <th>提交时间</th>
		        <th>操作</th>
		    </tr>
	    </thead>
    </table>
</div>
<form id="editForm">
<div style="display: none" class="maskback">
     <div class="mainback">
	     <input type="hidden" id="complId" name="complId">
	     <div class="form-cont">
	     <p class="form-cont-title">添加回复信息</p>
	     <textarea class="summer-textarea" id="backMsg" name="backMsg"></textarea>
	     </div>
	     <div class="form-btn-wrapper" id="funcbar" style="margin-top: 100px;">
	        <a id="save" href="javascript:;" class="btn btn-ok btn-normal  wave distance-right" >提交</a>
	        <a class="btn btn-normal" id="back">关闭</a>
	        
	     </div>
     </div>
</div>
</form>
<div style="display: none" class="maskbackf">
     <div class="mainbackf">
     <div class="form-cont">
     <p class="form-cont-title">回复信息</p>
     <textarea class="summer-textarea" id="backMsgs" name="backMsgs"></textarea>
     </div>
	     <div class="form-btn-wrapper" id="funcbar" style="margin-top: 100px;">
	        <a class="btn btn-normal" id="backf">关闭</a>
	     </div>
     </div>
</div>
<script>
	//请求url
	var CONST_URL = {
		LIST: basePath + '${common_url}list',
	   	INIT_ADD: basePath + "${common_url}initAdd",
	   	INIT_EDIT: basePath + "${common_url}initEdit",
	   	INIT_VIEW: basePath + "${common_url}initView",
	   	DEL: basePath + "${common_url}del",
	   	ADD_BACK: basePath + "${common_url}addback",
	   	VIEW_BACK: basePath + "${common_url}viewBack",
	   	IS_FINISHED: basePath + "${common_url}isFinished"
	};
	
    var  viewData,
    	 permission = CommonUtil.getPermission('${name_english}');
    
    $(function () {
    	viewData = ${viewData}
    	if(viewData != "null"){
    		$("#backMsgs").val(viewData.backMsg);
    		$(".maskbackf").show();  
    	}
    	$('#isFinished').combobox({
            valueField : 'code',
            textField : 'name',
            url : COMMON_URL.getCode + '?type=T_DM_T_USERS_COMPLAINT_IS_FINISHED'
        });
        // 新建toobar
		$.funcbar({
			id: 'toolbar',
			type: 'toolbar',
			data: permission,
			permit: ['${name_english}:initAdd']
		});
        
        // 查询按钮
        $('#search').on('click', reloadTable);
        
        //重置按钮
        $('#reset').on('click', function () {
        	//重置文本框的值
        	$('#id').val('');
        	$('#userId').val('');
        	$('#createTime').val('');
        	$('#updateTime').val('');
			$('#isFinished').combobox('clear');
        	reloadTable();
        });
        
        //新建
        $('#toolbar').on('click', 'a[data-permit="${name_english}:initAdd"]', function() {
        	window.location.href = CONST_URL.INIT_ADD; 	  	
		});
        
        
       createTable();
       //addback
        //弹窗
     $('#t-wrap').on('click', 'a[data-permit="${name_english}:addback"]', function() {
     	var $this = $(this),
     	    id = $this.closest('tr').find('td[data-field="id"]').attr('data-value');
     	$("#complId").val(id);
     	console.log($("#complId").val());
     	$(".maskback").show();     	
     });
       //viewBack
       $('#t-wrap').on('click', 'a[data-permit="${name_english}:viewBack"]', function() {
    	   var $this = $(this),
    	   id = $this.closest('tr').find('td[data-field="id"]').attr('data-value');
    	   window.location.href = CONST_URL.VIEW_BACK +"?id=" + id;
    	      	
     });
       //蒙版关闭
       $("#back").click(function(){
    		$(".maskback").hide();
    	});
     //蒙版关闭
       $("#backf").click(function(){
   		$(".maskbackf").hide();
   	});
       $("#save").on('click',submit);
        //查看
        $('#t-wrap').on('click', 'a[data-permit="${name_english}:initView"]', function() {
        	var $this = $(this),
        	    id = $this.closest('tr').find('td[data-field="id"]').attr('data-value');
        	window.location.href = CONST_URL.INIT_VIEW +"?id=" + id;
        });
       
        //编辑
        $('#t-wrap').on('click', 'a[data-permit="${name_english}:initEdit"]', function() {
            var $this = $(this),
                id = $this.closest('tr').find('td[data-field="id"]').attr('data-value');
            window.location.href = CONST_URL.INIT_EDIT + '?id=' + id;
        });	
        
        //确认解决
		$('#t-wrap').on('click', 'a[data-permit="${name_english}:isFinished"]', function() {
			var $this = $(this),
			    id = $this.closest('tr').find('td[data-field="id"]').attr('data-value');
			$.sdialog({
				type: 'confirm',
				msg: '您确定要确认解决该记录吗?',
				onConfirm: function(result) {
				    if (result) {
				    	$.sajax({
			                url : CONST_URL.IS_FINISHED + "?id=" + id,
			                onLoadSuccess : function() {
			                	 $.stip({
                	                type:'ok',//显示类型 有info、 ok、 danger
                	                text: '确认成功！'    
			                	});
			                	reloadTable();  
			                }
			            });
				    		
				    }	
				}
			});
		});
        
        //删除
		$('#t-wrap').on('click', 'a[data-permit="${name_english}:del"]', function() {
			var $this = $(this),
			    id = $this.closest('tr').find('td[data-field="id"]').attr('data-value');
			$.sdialog({
				type: 'confirm',
				msg: '您确定要删除该记录吗?',
				onConfirm: function(result) {
				    if (result) {
				    	$.sajax({
			                url : CONST_URL.DEL + "?id=" + id,
			                onLoadSuccess : function() {
			                	 $.stip({
                	                type:'ok',//显示类型 有info、 ok、 danger
                	                text: '删除成功！'    
			                	});
			                	reloadTable();  
			                }
			            });
				    		
				    }	
				}
			});
		});
        
    });
    
    
    // 重新加载表格
	function reloadTable() {
		$('#dataList').datagrid('reload',{
            ajax: {
            	param: {
            		"id": trimSpace($('#id').val()),
            		"userId": trimSpace($('#userId').val()),
            		"createTime": trimSpace($('#createTime').val()),
            		"updateTime": trimSpace($('#updateTime').val()),
					"isFinished": $('#isFinished').combobox('getValue')

            	}
            }
        });
	}
    
    //创建表格
    function createTable() {
    	$('#dataList').datagrid({
    		ajax: {
    			url: CONST_URL.LIST,
    			param: {
    				"id": trimSpace($('#id').val()),
            		"userId": trimSpace($('#userId').val()),
            		"createTime": trimSpace($('#createTime').val()),
            		"updateTime": trimSpace($('#updateTime').val()),
					"isFinished": $('#isFinished').combobox('getValue')
            	}
    		},
    		columns: [
    		     {
    		    	 field: 'id'
    		     },
    		     {
    		    	 render: function (rowData) {
    		    		 var html = "";
    		    		 html = "<p>"+rowData.userNickName+"</p>"
    		    		 		+"<p>"+rowData.userId+"</p>";
    		    		 		return html;
    		    	 }
    		     },
    		     {
    		    	 field:'userPhone'
    		     },
    		     {
    		    	 field: 'isFinished'
    		     },
    		     {
    		    	 field: 'createTime'
    		     },
    		    {
    		    	 render: function (rowData) {
    		    		 if(rowData.isFinished){
    		    			 return $.funcbar({
        		    			 data: permission,    //请求的数据
        		    			 type: 'text',     //类型
        		    			 display: 2,    //显示数量
        		    			 permit: ['${name_english}:viewBack', '${name_english}:del'] //需要的权限按钮
        		    		 }); 
    		    		 }else{
    		    			 if(rowData.backMsg != null && rowData.backMsg != ""){
    		    				 return $.funcbar({
            		    			 data: permission,    //请求的数据
            		    			 type: 'text',     //类型
            		    			 display: 3,    //显示数量
            		    			 permit: ['${name_english}:viewBack', '${name_english}:isFinished','${name_english}:del'] //需要的权限按钮
            		    		 }); 
    		    			 }else{
    		    				 return $.funcbar({
            		    			 data: permission,    //请求的数据
            		    			 type: 'text',     //类型
            		    			 display: 3,    //显示数量
            		    			 permit: ['${name_english}:addback', '${name_english}:isFinished','${name_english}:del'] //需要的权限按钮
            		    		 });
    		    			 }
    		    			 
    		    		 }
    		    	 }
    		    }
    		          
    	    ]
    	});
    }

   function submit(event){
	   $("#editForm").form({
           ajax: {
               url: CONST_URL.ADD_BACK,
                data:{
      				"complId" :$("#complId").val()
      			 }  
           },
           onSubmitSuccess: function (data) {
          	 console.log(data);
          	 $.stip({
	                type:'ok',//显示类型 有info、 ok、 danger
	                text: '保存成功！',
	                onBeforeHide: function () {
              	 
	               }
         	});
          	 //隐藏蒙版
      		 $(".maskback").hide();
        	 //刷新商品列表
      		reloadTable();
            }
       }).form("submit");
   }
   
</script>
</body>
</html>